﻿<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="JCNT.NoteWeb.WebII.Default" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>JackNote</title>
    <link rel="stylesheet" type="text/css" href="../js/jqe131/themes/default/easyui.css">
    <link rel="stylesheet" type="text/css" href="../js/jqe131/themes/icon.css">
    <link rel="stylesheet" type="text/css" href="../js/jqe131/demo/demo.css">
    <script type="text/javascript" src="../js/jqe131/jquery-1.8.0.min.js"></script>
    <script type="text/javascript" src="../js/jqe131/jquery.easyui.min.js"></script>
    <link href="../css/wpcms.css" rel="stylesheet" type="text/css" media="screen" />
    <script type="text/javascript" src="../js/webII.js"></script>
    <script type="text/javascript">
        function btn_Qry(value, name) {
            var sKey = value;
            sKey = sKey.replace(/\%/g, "%25");
            sKey = sKey.replace(/\#/g, "%23");
            sKey = sKey.replace(/\&/g, "%26");
            sKey = sKey.replace(/\+/g, "%2B");
            sKey = sKey.replace(/\ /g, "%20");
            sKey = sKey.replace(/\//g, "%2F");
            sKey = sKey.replace(/\?/g, "%3F");
            sKey = sKey.replace(/\=/g, "%3D");

            sKey = encodeURI(sKey); 

            $('#tab_Tit').datagrid({
                height: 350,
                sortName: 'Lab',
                sortOrder: 'desc',
                idField: 'ID',
                remoteSort: false,
                url: '../Web/Tree_Json.aspx?Lab=' + name + '&Key=' + sKey + '&id_tem=' + Math.random(),
                onClickRow: function (rowIndex, rowData) {
                    var sID = rowData.ID;
                    //iframe_Center.src = '../web/Right.aspx?ID=' + sID;
                    $("#iframe_Center").attr('src', '../web/Right.aspx?ID=' + sID);
                }
            });
        }

        function ref_Grid(strSQL) {
            var sKey = strSQL;
            sKey = sKey.replace(/\%/g, "%25");
            sKey = sKey.replace(/\#/g, "%23");
            sKey = sKey.replace(/\&/g, "%26");
            sKey = sKey.replace(/\+/g, "%2B");
            sKey = sKey.replace(/\ /g, "%20");
            sKey = sKey.replace(/\//g, "%2F");
            sKey = sKey.replace(/\?/g, "%3F");
            sKey = sKey.replace(/\=/g, "%3D");

            sKey = encodeURI(sKey); 

            $('#tab_Tit').datagrid({
                url: '../Web/Tree_Json.aspx?sql=' + sKey + '&id_tem=' + Math.random(),
                onClickRow: function (rowIndex, rowData) {
                    var sID = rowData.ID;
                    $("#iframe_Center").attr('src', '../web/Right.aspx?ID=' + sID);
                }
            });
        }

        function loadtree(nodeid, nodetext) {
            $('#tree').tree({
                url: 'Default.aspx?parentid=' + nodeid,
                animate: true,
                dnd: true,
                loadFilter: function(data) {
                    if (data.success) {
                        return data.nodes;
                    }
                    else {
                        document.write(data.text);
                    }
                },
                onBeforeExpand:function(node,param){
                    $('#tree').tree('options').url = "Default.aspx?parentid=" + node.id;                  
                },
                onClick: function(node) {
                    $(this).tree('toggle', node.target);
                    addTab(node.id, node.text, node.attributes.url);
                }
            });
            //$('#div_info').panel({ title: nodetext });

        }

        function tabrefresh() {
            var currTab = $('#tabs').tabs('getSelected');
            var iframe = $(currTab.panel('options').content);
            var src = iframe.attr('src');
            $('#tabs').tabs('update', { tab: currTab, options: { content: iframe.attr('src', src)} });
        }
        
        function addTab(id, title, url) {
            if (url == "")
                return;
            var tab = $('#tabs').tabs('exists', title);
            if (tab) {

                $('#tabs').tabs('select', title);
                var currTab = $('#tabs').tabs('getSelected');
                var iframe = $(currTab.panel('options').content);
                if (currTab.panel('options').content != null)
                    $('#tabs').tabs('update', { tab: currTab, options: { content: iframe.attr('src', url)} });
                else
                    $('#tabs').tabs('update', { tab: currTab, options: { content: '<iframe width="100%" height="99.5%" id="iframe_01"  scrolling="no" frameborder="0" src="Poll/PollHourAQI.aspx"></iframe>'} });
            } else {
                $('#tabs').tabs('add', {
                    title: title,
                    content: "<iframe width='100%' height='99.5%'  id='iframe_" + id + "' scrolling='auto' frameborder='0' src='" + url + "'></iframe>",
                    closable: true,
                    tools: [{ iconCls: 'icon-mini-refresh', handler: function() { tabrefresh(); } }]
                    });
                }
            }

            $(document).ready(function() {
                $('#mm').menu('appendItem', { text: 'TIT', iconCls: 'icon-ok' });
                $('#mm').menu('appendItem', { text: 'TXT', iconCls: 'icon-ok' });
                loadtree(0, '目录');
            });

    </script>
</head>
<body class="easyui-layout">
    <form id="form1" runat="server">
    <!-- top -->
    <div id="div_top" data-options="region:'north',border:false" class="top_div">
    </div>
    <div id="div_left" data-options="region:'west',split:true,title:'目录'" style="width: 250px;
        overflow: hidden;">
        <div class="easyui-accordion" data-options="fit:true,border:false">
            <div title="目录" data-options="iconCls:'icon-tree_2',selected:true" style="padding: 0px; overflow: auto;">
                <ul id="tree"></ul>
                <!--<iframe id="iframe_tree" name="iframe_tree" src="../web/Tree.aspx" class="iframe_tree_II" title="iframe_tree" frameborder="0" scrolling="auto"></iframe>-->
            </div>
            <div title="查找" data-options="iconCls:'icon-search',
				tools:[{
					iconCls:'icon-reload',
					handler:function(){
						$('#tt').datagrid('reload');
					}
				}]">
                <input class="easyui-searchbox" data-options="prompt:'Please Input Value',menu:'#mm',
			        searcher:btn_Qry" style="width: 240px"></input>
                <div id="mm" style="width: 120px">
                    <div data-options="name:'ALL',iconCls:'icon-ok'">ALL</div>
                </div>
                <table id="tab_Tit" class="easyui-datagrid" data-options="border:false,fit:true,fitColumns:true,singleSelect:true">
                    <thead>
                        <tr>
                            <th data-options="field:'ID',sortable:true">ID</th>
                            <th data-options="field:'Lab',sortable:true">分类</th>
                            <th data-options="field:'Tit',sortable:true">名称</th>
                        </tr>
                    </thead>
                </table>
            </div>
        </div>
    </div>
    <%--<div data-options="region:'east',split:true,collapsed:true,title:'East'" style="width:100px;padding:10px;">east region</div>--%>
    <%--<div data-options="region:'south',border:false" style="height:50px;background:#A9FACD;padding:10px;">south region</div>--%>
    <div id="div_center" data-options="region:'center',title:'',fit:true,border:false" style="overflow: hidden;">
        <div class="easyui-tabs" id="tabs" style="padding-top: 1px;" data-options="fit:true,border:false">
            <%--<div title="小时污染资料" tools="#p-tools">
                <iframe width="100%" height="99.5%" id="iframe_01" scrolling="no" frameborder="0" src="Poll/PollHourAQI.aspx"></iframe>
            </div>--%>
        </div>
        <%--<div style="background: #C9EDCC; padding: 2px; width: 100%;">
            <a href="javascript:void(0)" id="sb1" class="easyui-splitbutton" data-options="menu:'#mm1',iconCls:'icon-edit'" onclick="javascript:alert('edit')">Edit</a> 
            <a href="javascript:void(0)" id="sb2" class="easyui-splitbutton" data-options="menu:'#mm2',iconCls:'icon-ok'" onclick="javascript:alert('ok')">Ok</a> 
            <a href="javascript:void(0)" id="mb3" class="easyui-menubutton" data-options="menu:'#mm3',iconCls:'icon-help'">Help</a>
        </div>
        <iframe name="iframe_Center" id="iframe_Center" src="../web/Right.aspx" class="iframe_Center_II" title="iframe_Center" frameborder="0"></iframe>--%>
    </div>
    </form>
</body>
</html>
